{{ template "layout/header" .}}
<main id="body">
    <div class="container">
        <div class="btn-group mb-3 d-lg-none" role="group" id="my_mobile_nav">
            <a role="button" class="btn btn-secondary active" data-active="menu-my" href="/my.html">个人资料</a>
            <a role="button" class="btn btn-secondary" data-active="menu-my-thread" href="/my_thread.html">论坛帖子</a>
            <a role="button" class="btn btn-secondary" data-active="menu-my-notice" href="?my-notice.htm">消息</a>
        </div>
        <div class="row">
            <!-- 左侧菜单 -->
            <div class="col-lg-2 hidden-md hidden-sm" id="my_aside">
                <div class="card">
                    <div class="card-body text-center">
                        <img class="avatar-4" src="{{.sessions.Useravatar}}">
                        <br>zhang
                    </div>
                    <div class="list-group list-group-flush text-center">
                        <a href="/my.html" class="list-group-item list-group-item-action active"
                            data-active="menu-my">个人资料</a>
                        <a href="/my_thread.html" class="list-group-item list-group-item-action"
                            data-active="menu-my-thread">论坛帖子</a>
                        <a href="?my-notice.htm" class="list-group-item list-group-item-action"
                            data-active="menu-my-notice">消息</a>
                    </div>
                </div>
            </div>
            <!-- 右侧内容 -->
            <div class="col-lg-10" id="my_main">
                <div class="card">
                    <div class="card-header">
                        <ul class="nav nav-tabs card-header-tabs">
                            <li class="nav-item">
                                <a class="nav-link" href="/my.html" data-active="my_profile">基本资料</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link active" href="/my_password.html" data-active="my_password">密码</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/my_avatar.html" data-active="my_avatar">头像</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/my_rename.html" data-active="my_rename">更改用户名</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" href="/my.html?action=4" data-active="my-email_notice">邮件通知</a>
                            </li>
                        </ul>
                    </div>
                    <div class="card-body">
                        <div class="col-lg-6 mx-auto">
                            <form action="/api/v1/user/{{.sessions.Userid}}/password/reset" method="post"
                                id="reset_form">
                                <div class="form-group input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="icon-lock"></i></span>
                                    </div>
                                    <input type="password" class="form-control" id="password_old" name="password_old"
                                        placeholder="旧密码" required="">
                                    <div class="invalid-feedback"></div>
                                </div>
                                <div class="form-group input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="icon-lock"></i></span>
                                    </div>
                                    <input type="password" class="form-control" id="password_new" name="password_new"
                                        placeholder="新密码" required="">
                                    <div class="invalid-feedback"></div>
                                </div>
                                <div class="form-group input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="icon-lock"></i></span>
                                    </div>
                                    <input type="password" class="form-control" id="password_new_repeat"
                                        name="password_new_repeat" placeholder="重复新密码" required="">
                                    <div class="invalid-feedback"></div>
                                </div>
                                <div>
                                    <button type="button" class="btn btn-primary btn-block" id="submit"
                                        data-loading-text="正在提交...">修改密码</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<script>

    var qrform = $("#reset_form")
    var jsubmit = $('#submit');
    jsubmit.on('click', function () {
        var oldpass = $("#password_old").val().trim()
        var newpass = $("#password_new").val().trim()
        var repnewpass = $("#password_new_repeat").val().trim()

        if (oldpass.length == 0 || newpass.length == 0) {
            $.alert("密码不能为空")
            return
        }

        if (newpass != repnewpass) {
            $.alert("两次输入的密码不同，请重新输入")
            return
        }

        qrform.reset();
        jsubmit.button('loading');
        var postdata = qrform.serializeObject();
        console.log(postdata)

        $.xpost(qrform.attr('action'), postdata, function (code, message) {
            console.log(code, ":", message)
            if (code == 200) {
                $.alert("修改成功")
                setTimeout(function () {
                    // addNewPostElement()
                    location.reload()
                }, 2000)
            } else {
                $.alert("修改失败")
                // jform.find('[name="'+code+'"]').alert(message).focus();
                jsubmit.button('reset');
            }
        });

        return false;
    });
</script>
{{ template "layout/footer" .}}
